$(document).ready(function() 
{
	var selected_dates = new Array();
	// get all the events from the database using AJAX
	selected_dates = getSelectedDates();
	$('#datepicker-a').datepicker({
		dateFormat: 'yy-m-d',
		inline: true,
		beforeShowDay: function (date)
		{
			// get the current month, day and year
			// attention: the months count start from 0 that's why you'll need +1 to get the month right
			var mm = date.getMonth() + 1, 
				dd = date.getDate(),	
				yy = date.getFullYear();
			var dt = yy + "-" + mm + "-" + dd;
			
			if(typeof selected_dates[dt] != 'undefined')
			{
				// put a special class to the dates you have events for so you can distinguish it from other ones
				// the "true" parameter is used so we know what are the dates that are clickable
				return [true, " Highlighted"];
			}
			
			return [true, ""];
		},
		onSelect: function(date)
		{			
//			$.cookie('cdate',date,{expires : 1});
			// put the event's title in the dialog box 
			$('#dialog-a').attr('title', selected_dates[date]['task_name']); // for the first time you open the popup
			$('#dialog-a').dialog('option', 'title', selected_dates[date]['task_name']);
			// put the event's description text in the dialog box 
			$("#dialog-a").text("Detail : "+selected_dates[date]['task_detail']);
			// show the dialog box
			$("#dialog-a" ).dialog({
                            modal : true
                        });
        }
			
	});
});
function getSelectedDates()
{
	var the_selected_dates = new Array();
    $.ajax(
    {
        url: 'events.php',
        dataType: 'json',
        async: false,
        success: function(data)
        {
			$.each(data, function(n, val)
            {
                the_selected_dates[val.start_date] = val;
            });
        }
    });
    return the_selected_dates;
}
